<script type="text/javascript" src="{:get_http_type()}://webapi.amap.com/maps?v=1.4.6&amp;key=2df5711d4e2fd9ecd1622b5a53fc6b1d"></script>
<script type="text/javascript" src="SHOP_JS/address.js"></script>
<script type="text/javascript" src="STATIC_JS/map_address.js"></script>
<style>
    .update-address-html .order-map{width:876px;height:380px}
</style>

<!-- 修改收货地址模态 -->
<div id="update_address_box" class="update-address-box"></div>
<script type="text/html" id="update_address_html">

    <div class="layui-form update-address-html" id='update_address'lay-filter="update_address">
        <input type="hidden" name="order_id" value="{{ d.order_id }}"/>
        <!--自提点地址-->
        <div class="layui-form-item">
            <label class="layui-form-label"><span class="required">* </span>收货地址</label>
            <div class="layui-input-inline area-select">
                <select name="province_id" lay-filter="province_id" lay-verify="province_id">
                    <option value="">请选择省份</option>
                </select>
            </div>
            <div class="layui-input-inline area-select">
                <select name="city_id"  lay-filter="city_id" lay-verify="city_id">
                    <option value="">请选择城市</option>
                </select>
            </div>
            <div class="layui-input-inline area-select">
                <select name="district_id"  lay-filter="district_id" lay-verify="district_id">
                    <option value="">请选择区/县</option>
                </select>
            </div>
        </div>

        <div class="layui-form-item">
            <label class="layui-form-label"></label>
            <div class="layui-input-inline" >
                <input type="text" name="address"  placeholder="请填写具体地址" lay-verify="address" autocomplete="off" class="layui-input address-content ns-len-long" value="{{# if(d.address != undefined){}}{{ d.address}}{{#  } }}">
            </div>

            {{# if(d.order_type == 3){ }}
            <input type = "hidden" name="longitude" lay-verify="required" class="layui-input" value="{{# if(d.longitude != undefined){}}{{ d.longitude}}{{#  } }}"/>
            <input type = "hidden" name="latitude" lay-verify="required" class="layui-input"value="{{# if(d.latitude != undefined){}}{{ d.latitude}}{{#  } }}"/>
            <button class='layui-btn-primary layui-btn' onclick="refreshFrom();">查找地址</button>
            {{# } }}
        </div>
        {{# if(d.order_type == 3){ }}
        <!--地图定位-->
        <div class="layui-form-item">
            <label class="layui-form-label">地图定位</label>
            <div class="layui-input-block ns-special-length">
                <div id="container" class="order-map"></div>
            </div>
        </div>
        {{# } }}
        <!--联系人方式-->
        <div class="layui-form-item">
            <div class="layui-inline">
                <label class="layui-form-label">收货人</label>
                <div class="layui-input-block">
                    <input type="text" name="name" lay-verify="required" placeholder="请填写收货联系人" autocomplete="off" class="layui-input selffetch-input ns-len-mid" value="{{# if(d.name != undefined){}}{{ d.name}}{{#  } }}">
                </div>
            </div>
        </div>
        <div class="layui-form-item">
            <div class="layui-inline">
                <label class="layui-form-label">手机号码</label>
                <div class="layui-input-block">
                    <input type="text" name="mobile" lay-verify="phone" placeholder="请填写手机号码" autocomplete="off" class="layui-input selffetch-input ns-len-mid" value="{{# if(d.mobile != undefined){}}{{d.mobile }}{{#  } }}">
                </div>
            </div>
        </div>
        <div class="layui-form-item">
            <div class="layui-inline">
                <label class="layui-form-label">固定号码</label>
                <div class="layui-input-block">
                    <input type="text" name="telephone" placeholder="请填写固定号码" autocomplete="off" class="layui-input selffetch-input ns-len-mid" value="{{# if(d.telephone != undefined){}}{{d.telephone }}{{#  } }}">
                </div>
            </div>
        </div>
        <button class="layui-btn"  lay-submit id="submit_address" lay-filter="submit_address" style="display:none;">保存</button>
    </div>
</script>
<!-- 地址编辑 -->
<script>
    var map_class, form,latlng;
    /**
     * 订单地址修改
     */
    function orderAddressUpdate(order_id) {
        $.ajax({
            type: "post",
            url: ns.url("shop/order/getOrderInfo"),
            async: true,
            dataType: 'json',
            data: {
                "order_id": order_id
            },
            success: function (res) {
                if(res.code == 0){
                    //获取模板
                    var getTpl = $("#update_address_html").html();
                    //渲染模板
                    var order_data = res.data;
                    laytpl(getTpl).render(order_data, function(html) {
                        layer.open({
                            type: 1,
                            shadeClose: true,
                            shade: 0.3,
                            offset: 'auto',
                            scrollbar: true,
                            fixed: false,
                            title: "编辑收货地址",
                            area: ['1200px'],
                            btn: ['确定', '取消'],
                            yes: function(index, layero){
                                $("#submit_address").click();
                            },
                            btn2: function(index, layero){
                                layer.close(index);
                            },
                            content:  html,
                            cancel: function(){
                                //右上角关闭回调
                                //return false 开启该代码可禁止点击该按钮关闭
                            },
                            success: function(layero, index){


                                form.render();
                                //初始化省级地址
                                getAreaList(0, 1);
                                var repeat_flag = false;//防重复标识
                                form.render();
                                var initdata = {province_id : order_data.province_id, city_id : order_data.city_id, district_id : order_data.district_id};
                                initAddress(initdata, "update_address");

                                if(order_data.order_type == 3) {
                                    if ($.isEmptyObject(order_data) == true) {
                                        latlng = {lat: '', lng: ''};
                                    } else {
                                        latlng = {lat: order_data.latitude, lng: order_data.longitude};
                                    }

                                    map_class = new mapClass("container", latlng);
                                }
                                form.render();

                                form.on('submit(submit_address)', function(data){
                                    if(data.field.province_id == ''){
                                        layer.msg('请选择省份', {icon: 5, anim: 6});
                                        return;
                                    }
                                    if(data.field.city_id == ''){
                                        layer.msg('请选择城市', {icon: 5, anim: 6});
                                        return;
                                    }
                                    if(data.field.district_id == ''){
                                        layer.msg('请选择区/县', {icon: 5, anim: 6});
                                        return;
                                    }
                                    if(data.field.address == ''){
                                        layer.msg('请输入详细地址', {icon: 5, anim: 6});
                                        return;
                                    }
                                    //外卖订单修改地址必须选坐标
                                    if(order_data.order_type == 3){
                                        if(data.field.latitude == '' || data.field.longitude == ''  ){
                                            layer.msg('外卖订单必须选择地图坐标', {icon: 5, anim: 6});
                                            return;
                                        }
                                    }
                                    var province_name = $("option[value='" + data.field.province_id + "']").text();
                                    var city_name = $("option[value='" + data.field.city_id + "']").text();
                                    var district_name = $("option[value='" + data.field.district_id + "']").text();
                                    // var community_name = $("option[value='" + data.field.community_id + "']").text();
                                    data.field.province_name = province_name;
                                    data.field.city_name = city_name;
                                    data.field.district_name = district_name;
                                    // data.field.community_name = community_name;
                                    data.field.full_address = province_name +'-'+ city_name +'-'+ district_name;

                                    if(repeat_flag)return;
                                    repeat_flag = true;
                                    $.ajax({
                                        url: ns.url("shop/order/editaddress"),
                                        type: "POST",
                                        dataType: "JSON",
                                        async: false,
                                        data: data.field,
                                        success: function (res) {
                                            layer.msg(res.message);
                                            if(res.code == 0){
                                                layer.closeAll();
                                                location.reload();
                                            }else{
                                                repeat_flag = false;
                                            }
                                        }
                                    });
                                    return false;
                                });
                            }
                        });
                        form.render();
                    });
                }
            }
        })

    }

    /**
     * 重新渲染表单
     */
    function refreshFrom(){
        form.render();
        orderAddressChange();//改变地址
        map_class.mapChange();
    }

    //动态改变订单地址赋值
    function orderAddressChange(){
        map_class.address.province = $("select[name=province_id]").val();
        map_class.address.province_name = $("select[name=province_id] option:selected").text();
        map_class.address.city = $("select[name=city_id]").val();
        map_class.address.city_name = $("select[name=city_id] option:selected").text();
        map_class.address.district = $("select[name=district_id]").val();
        map_class.address.district_name = $("select[name=district_id] option:selected").text();
        // map_class.address.township = $("select[name=community_id]").val();
        // map_class.address.township_name = $("select[name=community_id] option:selected").text();
        map_class.address.address = $("input[name=address]").val()
    }

    /**
     * 地址下拉框（主要用于坐标记录）
     */
    function selectCallBack(){
        $("input[name=longitude]").val(map_class.address.longitude);//坐标
        $("input[name=latitude]").val(map_class.address.latitude);//坐标
        $("input[name=address]").val(map_class.address.address);//详细地址
        // console.log(map_class.address);
    }
    //地图点击回调时间
    function mapChangeCallBack(){

        $("input[name=address]").val(map_class.address.address);//详细地址
        $("input[name=longitude]").val(map_class.address.longitude);//坐标
        $("input[name=latitude]").val(map_class.address.latitude);//坐标
        $.ajax({
            type : "post",
            url : ns.url("shop/address/getGeographicId"),
            dataType: 'json',
            async : true,
            data : {
                "address" : map_class.address.area
            },
            success : function(data) {
                map_class.address.province = data.province_id;
                map_class.address.city = data.city_id;
                map_class.address.district = data.district_id;
                // map_class.address.township = data.community_id;
                map_class.map_change = false;
                form.val("update_address", {
                    "province_id": data.province_id // "name": "value"
                });
                $("select[name=province_id]").change();
                form.val("update_address", {
                    "city_id": data.city_id // "name": "value"
                });
                $("select[name=city_id]").change();
                form.val("update_address", {
                    "district_id": data.district_id // "name": "value"
                });
                $("select[name=district_id]").change();
                // form.val("update_address", {
                //     "community_id": data.community_id // "name": "value"
                // });
                refreshFrom();//重新渲染form
                map_class.map_change = true;
            }
        })
    }
</script>